<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>喂养详情</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>
<style>
    html,body,p{
        margin: 0;
        padding: 0;
        font-size: 12px;
    }
    body{
        background: #f5f5f5;
    }
    header{
        text-align: center;
        margin:10px 0 ;
        font-size: 20px;
    }
    .card{
        background: #ffffff;
        margin: 10px;
        padding: 10px;
        border-radius: 5px;
    }
    .card-head{
        font-size: 15px;
        font-weight: bold;
        color: #000;
        position: relative;
        padding-left: 10px;

    }
    .card-head:before{
        display: block;
        content: "";
        width: 3px;
        height: 14px;
        background: #FFA935;
        border-radius: 0px 0px 0px 0px;
        opacity: 1;
        position: absolute;
        left: 0;
        top: 3px;
    }
    .card-item{
        margin: 10px 0;
        font-size: 13px;
    }

    .card-item-label{
        font-weight: bold;
        color: #000;
        width: 370px;
        display: block;
    }
    .card-item-title{
        color: #9E9E9E;
        margin-top: 6px;
        display: block;
    }
</style>
<body>
<header>喂养信息</header>
<div class="card">
    <div class="card-head"><label>订单信息</label></div>
    <div class="card-item">
        <label class="card-item-label">服务专员</label>
        <label class="card-item-title">张咪</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">服务对象</label>
        <label class="card-item-title">小拼，淘宝</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">上门时间</label>
        <label class="card-item-title">2022年8月12日</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">服务地址</label>
        <label class="card-item-title">成都市高新区 石羊镇金水花园31栋一单元12楼01号</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">入户交接</label>
        <label class="card-item-title">密码锁，密码是2345532</label>
    </div>

</div>
<div class="card">
    <div class="card-head"><label>服务项目</label></div>
    <div class="card-item">
        <label class="card-item-label">清洗餐具：
        </label>
        <label class="card-item-title">清洗餐具，饮水机等，复杂设备仅做简单擦拭。</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">服务对象</label>
        <label class="card-item-title">小拼，淘宝</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">上门时间</label>
        <label class="card-item-title">2022年8月12日</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">服务地址</label>
        <label class="card-item-title">成都市高新区 石羊镇金水花园31栋一单元12楼01号</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">入户交接</label>
        <label class="card-item-title">密码锁，密码是2345532</label>
    </div>
    <div class="card-item">
        <label class="card-item-label">其它</label>
        <label class="card-item-title">密码锁，密码是2345532</label>
    </div>
</div>
</body>
</html>
